@import '@devui/theme/styles-var/devui-var.scss';

.#{$devui-prefix}-popup-line {
  width: 100%;
  height: 256px;
  border-bottom: 1px solid $devui-dividing-line;
  display: flex;

  .time-item {
    height: 100%;
    display: inline-block;
    border-right: 1px solid $devui-dividing-line;
    overflow-y: auto;

    &:last-child {
      border-right: none;
    }

    .time-ul {
      width: 100%;
      height: 100%;
      cursor: pointer;
      padding: 0;
      margin: 0 auto;
      list-style: none;

      .time-li {
        display: block;
        box-sizing: border-box;
        list-style: none;
        text-align: center;
        margin: 0;
        height: 26px;
        overflow: hidden;
        line-height: 26px;
        margin-bottom: 6px;
        font-size: 0;
        color: $devui-text;

        &:hover {
          background-color: $devui-list-item-hover-bg;
          color: $devui-list-item-hover-text;
        }

        span {
          display: block;
          font-size: $devui-font-size-md;
        }
      }

      &:last-child::after {
        content: '';
        display: block;
        height: 224px;
      }

      .active-li {
        background-color: $devui-list-item-active-bg;
        color: $devui-list-item-active-text;

        &:hover {
          background-color: $devui-list-item-active-bg;
          color: $devui-list-item-active-text;
        }
      }

      .disabled-li {
        background-color: $devui-disabled-bg;
        color: $devui-disabled-text;
        cursor: not-allowed;
      }
    }
  }
}
